<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Categories</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery-2.1.4.min.js"></script>
    <style>
        *{
            cursor: default;
        }
        html{width:100%;
            height:100%}
        body{width:100%;
            height:100%;
            background: url(images/login_bgx.gif) no-repeat;
            background-size:cover;     /*这里设置了背景图片为覆盖，以填满整个容器*/
        }
        .main_list{
            margin-left: 20%;
            margin-top: 10%;
            margin-bottom: 10%;
            font-family: 仿宋;
            font-size:20px;
            font-weight: bold;
        }
        #main_list{
            margin-top: 0%;
        }
        .main_list:hover{
            color:dimgrey;
        }
        .opreate:hover{
            color: #1b6d85;
        }

    </style>
</head>
<body>
<div style="width: 30%;height:100%;float: left">
    <div style="width: 60%;height: 80%;margin-left: 20%;margin-top: 10%;border-right-style:solid;border-right-width:1px;border-right-color:rosybrown ;">
        <div style="padding-top: 20%">
            <ul style="list-style:none; " id="main_list">
                <li class="main_list"><a href="categories.html">分类</a></li>
                <li class="main_list"><a href="articleManage.html">文章</a></li>
                <li class="main_list"><a href="aboutMange.html">关于</a></li>
                <li class="main_list">留言</li>
            </ul>
        </div>
    </div>
</div>
<div style="width: 70%;height:100%;float: right">
    <div style="margin-top: 10%">
        <p style="font-weight: 200;font-size: 30px">About</p>
    </div>
    <div style="margin-top: 5%;margin-right: 5%;height: 80%">
        <div>
            <div style="margin-bottom: 50px;margin-top: 50px">
                <lable>About shortContent</lable>
                <input type="text" style="width: 80%" id="about_shortContent" name="about_shortContent">
            </div>
            <lable>Article content</lable>
            <input type="hidden"id="hidden">
            <div id="ue"></div>
            <script id="container" name="content" type="text/plain"></script>
            <script type="text/javascript" src="ueditor.config.js"></script>
            <script type="text/javascript" src="ueditor.all.js"></script>
            <script type="text/javascript">
                var ue = UE.getEditor('container');
            </script>
        </div>
        <div>
            <button  id="submit">submit</button>
        </div>
    </div>
</div>
</body>
<script src="js/model.js"></script>
<script src="js/view.js"></script>
<script src="js/controller.js"></script>
<script type="application/javascript">
    $(function() {
       mvc.controller.getAbout01();
    });
    $('#submit').click(function () {
       var about_text = ue.getContent();
       var about_shortContent = $('#about_shortContent').val();
//       console.log(about_shortContent);
       mvc.controller.updateAbout01(about_text,about_shortContent);
    });
</script>

</html>